<template>
  <section>
    <!--工具条-->
    <el-form :inline="true" :model="searchForm" class="toolbar">
      <el-form-item label="活动专题">
        <el-select v-model="searchForm.activitySubject" placeholder="请选择" clearable>
          <el-option v-for="item in activitySubject" :label="item.title" :key="item.id" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="活动主题">
        <el-input v-model="searchForm.activityTitle"></el-input>
      </el-form-item>
    <el-form-item label="活动状态">
     <el-select v-model="searchForm.status" placeholder="请选择" clearable>
      <el-option v-for="item in status" :label="item.name" :key="item.code" :value="item.code"></el-option>
      </el-select>
      </el-form-item>
      <el-form-item>
        <el-button @click="search" type="info">查询</el-button>
      </el-form-item>
    </el-form>
    <div class="divid-line"></div>
<!--列表-->
<template>
  <el-table :data="gridData" highlight-current-row v-loading="gridLoading" class="grid">
    <el-table-column label="序号" type="index" width="100">
    </el-table-column>
   <el-table-column label="活动专题" prop="activitySubject"sortable>
   </el-table-column>
   <el-table-column label="活动主题" prop="title"  sortable>
   </el-table-column>
  <el-table-column label="开始时间" prop="startTime"  sortable>
   <template scope="scope">
     {{getdate(scope.row.startTime)}}
  </template>
</el-table-column>
<el-table-column label="结束时间" prop="endTime"  sortable>
  <template scope="scope">
    <span>{{getdate(scope.row.endTime)}}</span>
  </template>
</el-table-column>
<el-table-column label="参加人数" prop="persionCount"  sortable>
</el-table-column>
<el-table-column label="实到人数" prop="attendanceCount" sortable>
</el-table-column>
<el-table-column label="自评分数" prop="userScore" sortable>
</el-table-column>
<el-table-column label="活动状态" prop="status"  sortable>
  <template scope="scope">
    {{getStatus(scope.row.status)}}
  </template>
</el-table-column>
    <el-table-column label="操作" prop="remark">
      <template scope="scope">
        <el-button size="small" @click="lookDetail(scope.row)" v-if="scope.userScore" type="success">开始评价</el-button>
        <el-button size="small" @click="lookDetail(scope.row)" v-if="!scope.userScore" type="primary">查看详情</el-button>
      </template>
    </el-table-column>
</el-table>

<!--分页-->
<el-pagination class="pager" @size-change="pageSizeChange" @current-change="pageIndexChange" :current-page="pageIndex" :page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="dataTotal">
</el-pagination>



  <!--<el-dialog-->
    <!--title="发布活动"-->
    <!--:visible.sync="acitvityVisible"-->
    <!--width="100%"-->
    <!--v-loading="activityDialogLoading">-->

    <!--<span slot="footer" class="dialog-footer">-->
            <!--<el-button @click="activityBack">取 消</el-button>-->
            <!--<el-button type="primary" @click="phoneCheckCommit(dialogType)">确 定</el-button>-->
          <!--</span>-->
  <!--</el-dialog>-->
</template>
</section>
</template>
<script>
import enums from '../../common/Enum'
import DataUtil from '../../common/dataUtil'
import Config from '../../common/config'
export default {
  data () {
    let compareDate = (time, form, txt, type) => {
      let _cp1 = time.getTime() >= Date.now()
      let _cp2 = false
      let _input = this[form][txt]
      if (_input) {
        let _time = Date.parse(new Date(_input))
        if ((type == "s" && time.getTime() > _time) || (type == "e" && time.getTime() < _time)) {
          _cp2 = true
        }
      }
      return _cp1 || _cp2
    }
    return {
      searchForm:{
        activitySubject:'',
        activityTitle:'',
        status:'',
      },

      activitySubject:[],
      status:[{
        code:'1',
        name:'未开始',
      },{
        code:'2',
        name:'正在进行'
      },{
        code:'3',
        name:'已结束'
      }],
      dataTotal:0,
      gridLoading: true,
      pageIndex: 1,
      pageSize: 10,
      gridData:[],
      acitvityVisible: false,
      activityDialogLoading: false
    }
  },
  methods: {
    getActivitySubject() {

        this.$http.post('activity/listActivitySubject',{}).then(response => {
            if (response.body.code == 1) {
                this.activitySubject = response.body.data;
            }
        });
   },
  getdate(dates) {
    if(!dates){
      return '';
    }
    var myDate = new Date(dates);
    let minute=myDate.getMinutes();
    if(minute<10){
      minute="0"+minute;
    }
    let seconds=myDate.getSeconds()
    if(seconds<10){
      seconds="0"+seconds;
    }
    return myDate.getFullYear()+"-"+(myDate.getMonth()+1)+"-"+myDate.getDate()+" "+myDate.getHours()+":"+minute+":"+seconds
  },
   getStatus(type) {
     let re = '';
     this.status.forEach(obj => {
      if (obj.code == type) {
        re = obj.name;
        return
      }
    });
     return re
   },
     search() {
      this.bindGrid()
    },
    activityBack() {
      this.acitvityVisible = false;
      this.activityDialogLoading = false;
    },
    pageSizeChange(val) {
      this.pageSize = val;
      this.pageIndex = 1;
      this.bindGrid()
    },
    pageIndexChange(val) {
      this.pageIndex = val;
      this.$store.dispatch('getUserListIndex',val);
      this.bindGrid();
    },
    bindGrid() {
      this.gridLoading = true;
        // let _data = Object.assign(this.searchForm);
        let _data = Object.assign({

          userId: DataUtil.id(),
          pageNo:this.pageIndex,
          type:1,
          pageSize:this.pageSize}, this.searchForm);
        this.$http.post('activity/listActivity', _data).then(response => {
          if (1 == response.body.code) {
            this.gridLoading = false;
            this.gridData = response.body.data.list;
            this.dataTotal = response.body.data.total;
          } else {
            this.$message.error(body.message);
          }
        }).catch((e) =>{
          this.gridLoading = false;
        })
      },
    handleEdit(row) {
      window.open('#/PublishOrginzerTrain?id='+row.id + "&type=1" );
    },
    lookDetail(row) {
      window.open('#/ActivityCommentDetail?id='+row.id + "&actUserId=" + row.actUserId);
    },
    deleteActivity(row) {
      this.$confirm('此操作会删除该活动, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$http.post('activity/deleteActivityById',{"id":row.id}).then(response => {
          if (response.body.code == 1) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }
        });

      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    }
    },
    mounted: function () {
        this.bindGrid();
      this.getActivitySubject();
}
}
</script>
